angular.module('myApp', ['ngAnimate'])
    .controller('mynews', function ($scope, $http) {
        $http.get("js/success.json")
            .success(function (response) {
                $scope.names = response.records;

            });
    })
    .directive("rol", function($templateCache) {
        $templateCache.put("hello.html","<ul><li ng-repeat='x in names'>{{x.Name}}</li>" +
        "<li  ng-repeat='y in names'>{{y.Name}}</li><ul>");

        console.log($templateCache.get("hello.html"));
        return {
            restrict: 'AECM',
            template: $templateCache.get("hello.html"),
            replace: true,
            link: function($scope){
                var li = $(".news ul li");
                console.log(li)
                var index =0;
                var time = setInterval(function () {
                    index++
                    var a=(-25*index).toString();
                    $(".news ul").animate({top: a+'px'}, function () {
                        $(".news ul li ").append(li.eq(index));
                        if (index == $scope.names.length) {
                            $(".news ul").css('top', "0px");
                            index = 0;
                        }
                    });
                }, 1000);
            }
        }


    });




